﻿@model NaviCar.Models.Navegacao
       
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section InfoUser {
    @Html.Partial("InfoUser")
}

@section Scripts{
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
        var map;
        var rastreando = false;
        var codInt = 0;
        var intervalo = null;

        $(document).ready(function () {
                            
            var mapa = $("#map_canvas").get(0);

            var latlng = new google.maps.LatLng(41.875696, -87.624207);
            var myOptions = {
                zoom: 11,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            
            map = new google.maps.Map(mapa, myOptions);
            
//            var ctaLayer = new google.maps.KmlLayer('https://t3n6yw.bay.livefilestore.com/y1ppz3mZ8lvHS-kNmk42FLyZMKdlFf3veZT7J3r6j_9Sy12N8OjoeB1p1lbEMSNrHOycc3t88RV5gIAj8xDY5f7fDHYdHMbKzaT/KM.kml');
//            ctaLayer.setMap(map);
        });

        function iniciar() {
            var cod = $("#Veiculo").val();
            var par = {"codigo":cod};
            if (cod == "") return;
            
            $.post("Rastrear", par, function (data) {
                
                if (data.entidade != undefined) {

                    var myLatlng = new google.maps.LatLng(data.entidade.Latitude, data.entidade.Longitude);
                    var myOptions = {
                        zoom: 4,
                        center: myLatlng,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                    }
                    
                    map.setOptions(myOptions);

                    var marker = new google.maps.Marker({
                        position: myLatlng,
                        map: map,
                        title: data.entidade.Placa
                    });

                    if(codInt == 0 && rastreando == true){
                        intervalo = data.entidade.Intervalo; codInt = window.setInterval("iniciar();", intervalo);
                    }else if (data.entidade.Intervalo != intervalo && rastreando == true) {
                        window.clearInterval(codInt); intervalo = data.entidade.Intervalo; codInt = window.setInterval("iniciar();", intervalo);
                    }

                }

                if (data.msg != undefined) {
                    alert(data.msg);
                }

            });

        }

    </script>
}
<div><span>@Html.LabelFor(m=>m.Veiculo) &nbsp; @Html.EditorFor(m => m.Veiculo)</span>
    <input type="button" value="Ver No mapa" onclick="javascript:intervalo=30000; iniciar();rastreando=true;"/>
    <input type="button" value="Parar" onclick="javascript:if(rastreando==true){window.clearInterval(codInt);rastreando=false;codInt=0;}"/>
</div>
<div id="map_canvas" style="width: 100%; height: 600px"></div>